<!-- CompletedList 组件 - 开发者：冉帅 -->
<template>
  <ul class="todo" id="completed">
    <TodoItem
      v-for="(item, index) in completed"
      :key="'completed-' + index"
      :text="item"
      :index="index"
      :is-completed="true"
      @remove="handleRemove"
      @toggle="handleToggle"
    />
  </ul>
</template>

<script setup>
import TodoItem from './TodoItem.vue';

const props = defineProps({
  completed: Array
});

const emit = defineEmits(['remove', 'toggle']);

const handleRemove = (index, isCompleted) => {
  emit('remove', index, isCompleted);
};

const handleToggle = (index, isCompleted) => {
  emit('toggle', index, isCompleted);
};
</script>

<style scoped>
/* 已完成列表样式保持原有CSS不变 */
</style>
